// 导入基础库
import { connect, history } from 'umi';
// 导入配置参数
import df from '../../../config/dataFormat';
// 导入处理函数
// 导入UI组件
import { PageContainer } from '@ant-design/pro-layout';
import { Table } from 'antd';
import QF from './query_form';
// 导入LESS样式

const PageView = (props) => {
  // 初始化参数------------------------------------------------
  const { ui, socketio: io, dispatch: dp } = props;

  var cols = [...df.cols];
  // cols[5].render = (val) => {
  //   console.log(val)
  //   var g = val.split('#');
  //   return <span>{g[0]}</span>;
  // };

  // 表格参数
  const table_props = {
    bordered: true,
    scroll: { x: df.width, y: 600 },
    size: 'small',
    loading: ui.loading,
    pagination: {
      show: true,
      showSizeChanger: false,
      current: io.skip,
      pageSize: df.pageSize,
      showTotal: (total, range) =>
        `共：${total} 条记录，当前显示：${range[0]}-${range[1]} 条记录`,
      total: io.profile_count,
      onChange: (e) => {
        dp({ type: 'socketio/save', payload: { skip: e } });
        dp({ type: 'socketio/get_profile_list' });
      },
    },
    columns: cols,
    dataSource: io.profile_list,
    onRow: (record) => {
      return {
        onContextMenu: (e) => {
          e.preventDefault();
        },
        onDoubleClick: (e) => {
          e.preventDefault();
          history.push(`/profile/view/${record._id}`);
        },
      };
    },
  };

  // 渲染UI组件------------------------------------------------
  return (
    <PageContainer
      content={
        <div style={{height:50}}>
          <QF
            def={io.profile_query}
            onFinish={(e) => {
              dp({
                type: 'socketio/save',
                payload: { profile_query: e },
              });
              dp({ type: 'socketio/get_profile_list' });
            }}
          />
        </div>
      }
    >
      <Table {...table_props} />
    </PageContainer>
  );
};

export default connect(({ ui, table, socketio }) => ({ ui, table, socketio }))(
  PageView,
);
